<template>
  <div>
    <div class="div">
      <input
        class="ipt"
        type="text"
        placeholder="请输入要搜索的内容"
        v-model="findcode"
      />
      <el-button type="primary" size="mini" @click="findcodelist"
        >搜索</el-button
      >
    </div>
    <template v-if="searchList.length">
      <el-table :data="searchList" style="width: ">
        <el-table-column fixed prop="code" label="订单编号" width="170">
        </el-table-column>
        <el-table-column prop="createTime" label="下单时间" width="160">
        </el-table-column>
        <el-table-column prop="userPass" label="订单金额" width="120">
        </el-table-column>
        <el-table-column prop="name" label="会员账号" width="120">
        </el-table-column>
        <el-table-column label="操作" width="150">
          <template slot-scope="scope">
            <el-button size="mini" width="50" @click="godetile(scope.row.code)"
              >查看</el-button
            >
            <el-button
              size="mini"
              type="danger"
              width="50"
              @click="getdelete(scope.row.code)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </template>
    <template v-else>
      <el-table :data="tableData" style="width: ">
        <el-table-column fixed prop="member.code" label="订单编号" width="170">
        </el-table-column>
        <el-table-column prop="member.createTime" label="下单时间" width="160">
        </el-table-column>
        <el-table-column prop="member.userPass" label="订单金额" width="120">
        </el-table-column>
        <el-table-column prop="member.name" label="会员账号" width="120">
        </el-table-column>
        <el-table-column label="操作" width="150">
          <template slot-scope="scope">
            <el-button size="mini" width="50" @click="godetile(scope.row.code)"
              >查看</el-button>
            <el-button
              size="mini"
              type="danger"
              width="50"
              @click="getdelete(scope.row.code)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </template>
  </div>
</template>

<script>
import { getorderlist, getDeleteData, findcodelist } from "../../api/paper";
export default {
  data() {
    return {
      input: "",
      tableData: [],
      searchList: [],
      findcode: "",
    };
  },
  methods: {
    async getlist() {
      let list = await getorderlist(1, 3);
      this.tableData = list.result.list;
      console.log("tableData", this.tableData);
    },
    godetile(code) {
      this.$router.push({
        path: "/setting/option",
        query: {
          code,
        },
      });
    },
    async getdelete(code) {
      let res = await getDeleteData(code);
      console.log("res", res);
      this.getlist();
    },
    //搜索
    async findcodelist() {
      //非空校验
      if (!this.findcode) {
        this.$message("请输入要搜索的内容");
      } else {
        let list = await findcodelist(this.findcode);
        //去重
        if (this.searchList.filter((item) => item.code == res.reult.code).length === 0
        ) {
          this.searchList.push(list.result);
        }
      }
    },
  },
  created() {
    this.getlist();
  },
};
</script>

<style lang="scss" scoped>
.div {
  display: flex;
  margin: 10px 0;
  .ipt {
    margin-right: 5px;
  }
}
</style>

